<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>品牌管理</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../plugins/adminLTE/css/AdminLTE.css">
    <link rel="stylesheet" href="../plugins/adminLTE/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="../css/style.css">
	<script src="../plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script src="../plugins/bootstrap/js/bootstrap.min.js"></script>

    
</head>
<body class="hold-transition skin-red sidebar-mini">
  <!-- .box-body -->
    <div class="box-header with-border">
        <h3 class="box-title">品牌管理</h3>
    </div>

    <div class="box-body">

        <!-- 数据表格 -->
        <div class="table-box">

            <!--工具栏-->
            <div class="pull-left">
                <div class="form-group form-inline">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default" title="新建" data-toggle="modal" data-target="#editModal"><i class="fa fa-file-o"></i> 新建</button>
                        <button type="button" class="btn btn-default" title="修改" data-toggle="modal" data-target="#aditModal" ><i class="fa fa-file-o"></i> 修改</button>
                        <button type="button" class="btn btn-default" title="删除" onclick="deleteByIds()"><i class="fa fa-trash-o"></i> 删除</button>
                        <button type="button" class="btn btn-default" title="刷新" onclick="window.location.reload();"><i class="fa fa-refresh"></i> 刷新</button>
                    </div>
                </div>
            </div>
            <div class="box-tools pull-right">
                <div class="has-feedback">

                </div>
            </div>

            <div id="brandTable"></div>
            <div id="updateBrandList"></div>
            <!--工具栏/-->

              <!--数据列表-->

              <!--<table id="dataList" class="table table-bordered table-striped table-hover dataTable">
                 <<thead>
                     &lt;!&ndash; <tr>
                          <th class="" style="padding-right:0px">
                              <input id="selall" type="checkbox" class="icheckbox_square-blue">
                          </th>
                          <th class="sorting_asc">品牌ID</th>
                          <th class="sorting">品牌名称</th>
                          <th class="sorting">品牌首字母</th>
                          <th class="text-center">操作</th>
                      </tr>&ndash;&gt;

</thead>
<tbody>-->
<script>
  $(function () {
      show();
  })
  function show(){
      $.ajax({
          url:"/brandController/findBrandAll",
          type:"get",
          data : $("#OneForm").serialize(),
          dataType:"json",
          async:false,
          success:function(page){
              var result=page.data.result;

              console.log(result);
              var info = "";
              info += '<table id="dataList" class="table table-bordered table-striped table-hover dataTable">';
              info += '<thead>';
              info += '<tr>';
              info += '<th class="" style="padding-right:0px">';
              info += '<input id="selall" type="checkbox" class="icheckbox_square-blue">';
              info += '</th>';
              info += '<th class="sorting_asc">品牌ID</th>';
              info += '<th class="sorting">品牌名称</th>';
              info += '<th class="sorting">品牌首字母</th>';
              info += '<th class="text-center">操作</th>';
              info += '</tr>';
              info += '</thead>';
              info += '<tbody>';
              $(result).each(function (i,e) {
                  info+= '<tr>';
                  info+= '<td><input  type="checkbox" value="'+e["id"]+'" name="brandCheckbox" ></td>';
                  info+= '<td>'+e['id']+'</td>';
                  info+= '<td>'+e['name']+'</td>';
                  info+= '<td>'+e['firstChar']+'</td>';
                  info+= '<td class="text-center">';
                  info+= '<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" onclick="eachBrandInfo('+e["id"]+')"  >修改</button>';
                  info+= '</td>';
                  info+= '</tr>';
              })
              info += '</tbody>';
              info += '</tbody>';
              $("#brandTable").html(info);
              pageInstall(page.data);
          },
          error:function(){
              alert("系统异常");
          }
      })
  }
  //增加
  function insertBrandInfo() {
      $.ajax({
          url : "/brandController/insertBrandInfo",
          type : "post",
          data : $("#addForm").serialize(),
          dataType : "json",
          async : false,
          success : function(data){
              if(data.code == 200){
                  alert(data.message);
                  window.location.reload();
              }else {
                  alert(data.message)
              }
          },
          error :function(){
              alert("系统异常,请联系管理员");
          }
      })
  }

  //修改回显页面
  function eachBrandInfo(id){
      $.ajax({
          url:"/brandController/eachBrandInfo/"+id,
          type:"post",
          //data:$("#updateForm").serialize(),
          dataType:"json",
          async:false,
          success:function(result){
              var brand = result.data;
              var info = "";
              info += '<div class="modal fade" id="aditModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">';
              info += '<div class="modal-dialog" >';
              info += '<div class="modal-content">';
              info += '<div class="modal-header">';
              info += '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>';
              info += '<h3 id="myModalLabel2">品牌编辑</h3>';
              info += '</div>';
              info += '<div class="modal-body">';
              info += '<form id="updateFrom">';
              info += '<table class="table table-bordered table-striped"  width="800px">';
              info += '<tr>';
              info += '<td><input  type="hidden" class="form-control" name="id" id="id" value="'+brand["id"]+'">  </td>';
              info += '<tr>';
              info += '<tr>';
              info += '<td>品牌名称</td>';
              info += '<td><input  class="form-control" placeholder="品牌名称" name="name" id="name" value="'+brand["name"]+'">  </td>';
              info += '</tr>';
              info += '<tr>';
              info += '<td>首字母</td>';
              info += '<td><input  class="form-control" placeholder="首字母" name="firstChar"  id="firstChar" value="'+brand["firstChar"]+'">  </td>';
              info += '</tr>';
              info += '</table>';
              info += '</div>';
              info += '<div class="modal-footer">';
              info += '<button class="btn btn-success" data-dismiss="modal" aria-hidden="true" onclick="updateBrandById()">修改</button>';
              info += '<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>';
              info += '</div>';
              info += '</div>';
              info += '</div>';
              info += '</div>';
              $("#updateBrandList").html(info);
          },
          error:function(){
              alert("系统异常,请联系客服处理");
          }
      })
  }
  //修改页面
  function updateBrandById(){
      $.ajax({
          url:"/brandController/updateBrandById",
          type:"post",
          data:$("#updateFrom").serialize(),
          dataType:"json",
          async:false,
          success:function(result){
              if (result.code == 200) {
                  alert(result.message);
                  window.location.reload();
              }else {
                  alert(result.message)

              }
          },
          error:function(){
              alert("系统异常,请联系客服处理");
          }
      })
  }


  //删除
  function deleteByIds() {
      var arr = [];
      var boxs = $("[type=checkbox]:checked");
      for (var i = 0; i < boxs.length; i++) {
          arr.push(boxs[i].value);
      }
      if (arr.length < 1) {
          alert("请先选中");
          return;
      }
      $.ajax({
          type: "post",
          dataType: "json",
          data: {arr: arr},
          async:false,
          url: "/brandController/deleteByIds",
          success: function (result) {
              if (result.code == 200) {
                  window.location.reload();
                  alert("确定删除id为 ： " + result.data + "？")
              } else {
                  alert(result.message);
              }
          },
          error: function () {

          }
      })
  }
</script>
              <!--<tr>
                  <td><input  type="checkbox"></td>
                  <td>2</td>
                  <td>华为</td>
                  <td>H</td>
                  <td class="text-center">
                      <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal"  >修改</button>
                  </td>
              </tr>
              <tr>
                  <td><input  type="checkbox"></td>
                  <td>3</td>
                  <td>三星</td>
                  <td>S</td>
                  <td class="text-center">
                      <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal"  >修改</button>
                  </td>
              </tr>-->
    <div th:replace="common/page :: foot"></div>
          </tbody>
      </table>
      <!--数据列表/-->

</div>
<!-- 数据表格 /-->

     </div>
    <!-- /.box-body -->
<!-- 编辑窗口 -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog" >
	<div class="modal-content">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
			<h3 id="myModalLabel">品牌编辑</h3>
		</div>
		<div class="modal-body">

            <form id="addForm">
			<table class="table table-bordered table-striped"  width="800px">
		      	<tr>
		      		<td>品牌名称</td>
		      		<td><input  class="form-control" placeholder="品牌名称" name="name">  </td>
		      	</tr>		      	
		      	<tr>
		      		<td>首字母</td>
		      		<td><input  class="form-control" placeholder="首字母" name="firstChar">  </td>
		      	</tr>		      	
			 </table>
            </form>

		</div>
		<div class="modal-footer">						
			<button class="btn btn-success" data-dismiss="modal" aria-hidden="true" onclick="insertBrandInfo()">保存</button>
			<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>
		</div>
	  </div>
	</div>
</div>

   
</body>
</html>